<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>宇成建筑</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="../statics/css/font.css">
    <link rel="stylesheet" href="../statics/plugins/layui/css/layui.css">
    <link rel="stylesheet" href="../statics/css/xadmin.css">
    <link rel="stylesheet" href="../statics/css/style.css">
    <link rel="stylesheet" href="../statics/css/ImgCropping.css">
    <link rel="stylesheet" href="../statics/plugins/cropper/cropper.min.css">
</head>

<body class='labelAuto addPeople'>
    <div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="welcome.html">首页</a>
            <a href="javascript:;">人力资源管理</a>
            <a href="javascript:;">人员列表</a>
            <a>
                <cite>人员信息</cite>
            </a>
        </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
    </a>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right;margin-right:10px"
       onclick="window.history.go(-1)" title="后退">
        <i class="iconfontBlod" style="line-height:30px">&#xe74f;</i>
    </a>
</div>
<div class="layui-fluid personnel_xq">
    <div class="layui-row layui-col-space15">
        <div class="layui-card">
            <form action="" class="layui-form">
                <div class="layui-card-body">
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <h2>基本信息</h2>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">姓名</label>
                                        <div class="layui-input-block">
                                            <input type="text" class="layui-input" id='name' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">性别</label>
                                        <div class="layui-input-block">
                                            <input type="text" class="layui-input" id='gender' disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">年龄</label>
                                        <div class="layui-input-block">
                                            <input type="number" class="layui-input" id='age' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">民族</label>
                                        <div class="layui-input-block">
                                            <input type="text" class="layui-input" id='nation' disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">身份证号</label>
                                        <div class="layui-input-block">
                                            <input type="text" class="layui-input" id='idcard' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">银行卡号</label>
                                        <div class="layui-input-block">
                                            <input type="number" class="layui-input" id='bankNumber' disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">家庭住址</label>
                                        <div class="layui-input-block">
                                            <input type="text" class="layui-input" id='homeAddress' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">联系方式</label>
                                        <div class="layui-input-block">
                                            <input type="text" class="layui-input" id='phone' disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">签订合同时间</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='contractTime' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">入场教育时间</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='eduTime' disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">离职时间</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='resignTime' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">

                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs12">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">工人头像</label>
                                        <div class="layui-input-block" style="height: auto;">
                                            <!-- <button id="replaceImg" class="l-btn" type='button'>更换图片</button> -->
                                            <div class='pictureContainer'>
                                                <img id="finalImg" src="" class='lessonCover' style="width:120px;">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-card-body">
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <h2>工作信息</h2>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">工号</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='jobNumber' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">工种</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='professionName'
                                                   disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-row">
                            <div class="layui-col-xs10">
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">当前项目</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='projectName' disabled>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-col-xs6">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">日工值</label>
                                        <div class="layui-input-block">
                                            <input type="text" readonly class="layui-input" id='dayValue' disabled>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-card-body">
                    <div class="layui-form-item">
                        <div class="layui-row">
                            <h2>工资信息</h2>
                        </div>
                        <div class="layui-row">
                            <table class="layui-table" id='wages' lay-filter="test"></table>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
<script type="text/html" id="toolbar">
    <button class="layui-btn" type="button" lay-event="excel">导出工资信息</button>
</script>
<script src="../statics/plugins/layui/layui.js" charset="utf-8"></script>
<script src='../statics/plugins/jQuery-3.2.1/jquery-3.2.1.min.js'></script>
<script type="text/javascript" src="../statics/plugins/X-admin/xadmin.js"></script>
<script type="text/javascript" src="../statics/js/public.js?v=1129"></script>
<script src="../statics/plugins/cropper/cropper.min.js"></script>
<script type="text/javascript">
    layui.use(['form', 'layer', "table", "laydate"], function () {
        var table = layui.table;
        var form = layui.form;
        var layer = layui.layer;
        var id = getQueryString('id');
        var info = '';

        $.ajax({
            url: url + '/hrm/employee/info',
            type: "post",
            async:false,
            data: {
                id: id,
                token: getToken()
            },
            dataType: "json",
            success: function (r) {
                if (r.code == 100000) {
                    info = r.data
                } else {
                    tips('详情', r);
                }
            }
        });

        for(var b in info){
            switch (b) {
                case 'gender':
                    $('#'+b).val(info[b]===1?'男':'女');
                    break;
                case 'contractTime':
                case 'eduTime':
                case 'resignTime':
                    $('#'+b).val(info[b].substr(0,10));
                    break;
                default:
                    $('#'+b).val(info[b]);
            }
        }

        var lists = table.render({
            elem: '#wages', //绑定DOM元素
            id: 'lists', //table的id
            title: '人员列表',
            // height: 'full-100',
            cellMinWidth:60,
            contentType: "application/json; charset=utf-8",
            url: url + '/finance/wage/personalWage', //数据接口地址
            method: 'POST',
            parseData: function (res) {
                return {
                    "code": res.code, //解析接口状态
                    "data": res.data,
                    "msg": res.msg,
                };
            },
            where: {
                id: id,
                token: getToken()
            },
            toolbar: '#toolbar',
            defaultToolbar: [],
            page: false, //开启分页
            cols: [
                [ //表头
                    {field: '', title: '月份', width: '10.2%',totalRowText:'总计',templet:function(d){
                        return d.LAY_TABLE_INDEX;
                        }},
                    {
                        field: 'income', title: '收入汇总', width: '10%',style:'color:darkcyan;font-weight: 700;', templet: function (d) {
                            return Number(d.workmanAccounts) + Number(d.handymanAccounts) + Number(d.attendance) * Number(info.dayValue);
                        }
                    },
                    {
                        field: 'workmanAccounts', title: '施工分账', width: '10%',style:'color:darkcyan;font-weight: 700;', templet: function (d) {
                            return Number(d.workmanAccounts);
                        }
                    },
                    {
                        field: 'handymanAccounts', title: '杂工分账', width: '10%',style:'color:darkcyan;font-weight: 700;', templet: function (d) {
                            return Number(d.handymanAccounts);
                        }
                    },
                    {
                        field: 'attendance', title: '考勤天数', width: '8%', templet: function (d) {
                            return Number(d.attendance);
                        }
                    },
                    {
                        field: 'attendanceAccounts', title: '考勤工资', width: '10%',style:'color:darkcyan;font-weight: 700;', templet: function (d) {
                            return Number(d.attendance) * Number(info.dayValue);
                        }
                    },
                    {
                        field: 'materialAccounts', title: '材料费', width: '8%',style:'color:lightcoral;font-weight: 700;', templet: function (d) {
                            return Number(d.materialAccounts);
                        }
                    },
                    {
                        field: 'loan', title: '借款', width: '8%',style:'color:lightcoral;font-weight: 700;', templet: function (d) {
                            return Number(d.loan);
                        }
                    },
                    {
                        field: 'livingRecharge', title: '生活费充值', width: '8%',style:'color:lightcoral;font-weight: 700;', templet: function (d) {
                            return Number(d.livingRecharge);
                        }
                    },
                    {
                        field: 'livingRefund', title: '生活费退款', width: '8%',style:'color:lightcoral;font-weight: 700;', templet: function (d) {
                            return Number(d.livingRefund);
                        }
                    },
                    {
                        field: 'balance', title: '结余', width: '10%',style:'color:darkcyan;font-weight: 700;', templet: function (d) {
                            var zj = Number(d.workmanAccounts)
                                +Number(d.handymanAccounts)
                                +Number(d.attendance) * Number(info.dayValue)
                                -Number(d.materialAccounts)
                                -Number(d.livingRecharge)
                                +Number(d.livingRefund)
                                -Number(d.loan);
                            if (zj<0){
                                return `<span style="color:lightcoral;font-weight: 700;">${zj}</span>`
                            }else{
                                return `<span style="color:darkcyan;font-weight: 700;">${zj}</span>`;
                            }
                        }
                    },
                ]
            ],
            totalRow:true,
            response: {
                statusName: 'code', //数据状态的字段名称，默认：code
                statusCode: 100000, //成功的状态码，默认：0
                msgName: 'msg', //状态信息的字段名称，默认：msg
                countName: 'count', //数据总数的字段名称，默认：count
                dataName: 'data' //数据列表的字段名称，默认：data
            },
            done:function(res, curr, count){
                var workmanAccounts=handymanAccounts=attendance=attendanceAccounts=materialAccounts=loan=livingRecharge=livingRefund=0;
                for(var i in res.data){
                    workmanAccounts += res.data[i].workmanAccounts;
                    handymanAccounts += res.data[i].handymanAccounts;
                    attendance += Number(res.data[i].attendance);
                    attendanceAccounts += res.data[i].attendance * info.dayValue;
                    materialAccounts += res.data[i].materialAccounts;
                    loan += res.data[i].loan;
                    livingRecharge += res.data[i].livingRecharge;
                    livingRefund += res.data[i].livingRefund;
                }
                var income = workmanAccounts + handymanAccounts +attendanceAccounts;
                var balance = income - materialAccounts - loan - livingRecharge + livingRefund;
                $('.layui-table-total td[data-field=income] div').empty().html(income);
                $('.layui-table-total td[data-field=workmanAccounts] div').empty().html(workmanAccounts);
                $('.layui-table-total td[data-field=handymanAccounts] div').empty().html(handymanAccounts);
                $('.layui-table-total td[data-field=attendance] div').empty().html(attendance);
                $('.layui-table-total td[data-field=attendanceAccounts] div').empty().html(attendanceAccounts);
                $('.layui-table-total td[data-field=materialAccounts] div').empty().html(materialAccounts);
                $('.layui-table-total td[data-field=loan] div').empty().html(loan);
                $('.layui-table-total td[data-field=livingRecharge] div').empty().html(livingRecharge);
                $('.layui-table-total td[data-field=livingRefund] div').empty().html(livingRefund);
                $('.layui-table-total td[data-field=balance] div').empty().html(balance);
                permission();
            }
        });

        table.on('toolbar(test)',function(data){
            if (data.event === 'excel'){
                layer.open({
                    type: 0,
                    title: "导出工资",
                    area: ['40%', '30%'],
                    content: `<p class='one_p'>正在生成excel表格,请稍等!</p>`
                })
                $.ajax({
                    url: url + '/excel/export/personalWage',
                    type: 'post',
                    async: false,
                    data: {
                        token: getToken(),
                        id: Number(id)
                    },
                    dataType: "json",
                    success: function (r) {
                        if (r.code == 100000) {
                            tips('导出工资', r);
                        } else {
                            tips('导出工资', r);
                        }
                    }
                })
            }
        });
    });
</script>
</html>